Bootstrap provides several form control styles, layout options, and custom components for creating a wide variety of forms for layouts, input states, sizing and styles. To keep the consistency, The following selections of form controls can be used as examples on MySolidWorks site.

Bootstrap provides provide 3 types of form layouts: 1) Vertical form (default), 2) Horizontal form; and 3) Inline form. Vertical form goes well with responsive design and won't break UI in most cases when resizing browser windows or on mobile devices. It would be the form layout on MySolidWorks site.

Form controls automatically receive some global styling with Bootstrap. All textural <input>, <textarea>, <select> elements with class .form-control have a width of 100%. Use these bootstrap classes to opt into their customized displays for a more consistent rendering across browsers and devices. The example form below demonstrates common HTML form elements that receive updated styles from Bootstrap with additional classes. Since Bootstrap utilizes the HTML5 doctype, all inputs must have a type attribute.

Add the disabled boolean attribute on an input to prevent user interactions. Disabled inputs appear lighter and add a not-allowed cursor.

Bootstrap provides classes of 3 height sizes for input element like text box and select dropdowns. Those 3 sizes are default, large and small, each size is defined with different properties for height, padding and font-size. For consistency, we use default size for MySolidWorks site.

Bootstrap includes validation styles for danger, warning, and success states on form controls.